<template>
  <el-dialog v-model="dialogVisible" :title="`删除${dialogTitle}`" width="500" height="500" center>
    <span>是否降职此管理员职位, 降职后此用户展现在用户列表中</span>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="goReduceLevel(userId)">
          确定
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import { updateAdminToUserAPI } from '../../../api/userinfo'
import { tracking } from '../../../utils/operate.js'

const dialogVisible = ref(false)
const dialogTitle = ref('')
const userId = ref('')

const props = defineProps({
  getFirstPage: Function
})


// 打开弹框
const openDialog = (id, title) => {
  dialogVisible.value = true
  dialogTitle.value = title
  userId.value = id
}

const goReduceLevel = async (id) => {
  const res = await updateAdminToUserAPI(id)
  if (res.data.status == 0) {
    dialogVisible.value = false
    ElMessage({
      message: res.data.message,
      type: 'success'
    })
    if (props.getFirstPage) {
      props.getFirstPage()
    }
    tracking("用户管理", "降职", userId.value, "高级")
  } else {
    ElMessage({
      message: res.data.message,
      type: 'error'
    })
  }

}

defineExpose({
  openDialog
})
</script>